import { onMounted } from 'vue'

//高度同步 操作
export const useCrud = (dataP: any) => {
	const data = {
		id: '',
		attendance: null,
		scheduleRef: null
	}

	const mergeDefaultOptions = (options: any, props: any) => {
		for (const key in options) {
			if (!Object.getOwnPropertyDescriptor(props, key)) {
				props[key] = options[key]
			}
		}
		return props
	}

	/**
	 * TODO
	 * 从上层传递的 ref 对象 attendance，
	 * attendance：any 接收后， 无法.$el 操作
	 */
	// 覆盖默认值
	const state = mergeDefaultOptions(data, dataP)

	onMounted(() => {
		pHeight(state.id, state.attendance, state.scheduleRef)
	})
	const pHeight = (id: string, attendance: any, scheduleRef: any) => {
		let pi = document.getElementById(id)
		let ar = attendance.value.$el.clientHeight
		let sr = scheduleRef.value.$el.clientHeight
		let c = ar - sr
		pi?.setAttribute('style', 'height:' + c + 'px;')
	}

	return {
		pHeight
	}
}
